import { Series, Video, Sequence, interpolate, useVideoConfig } from "remotion";
// 导入视频文件
import video1 from "./assets/03.mp4";
import video2 from "./assets/04.mp4";

export const CombinedVideo = () => {
  const config = useVideoConfig();

  return (
    <Series>
      <Series.Sequence durationInFrames={150}>
        <Video
          src={"https://www.w3schools.com/html/movie.mp4"}
          onError={(e) => {
            console.error("Video 1 error:", e);
          }}
        />
      </Series.Sequence>

      <Series.Sequence durationInFrames={30}>
        <Sequence from={0}>
          <Video
            src={"https://www.w3school.com.cn/example/html5/mov_bbb.mp4"}
            onError={(e) => {
              console.error("Video 2 error:", e);
            }}
          />
        </Sequence>
        {/* <Sequence from={0}>
          <Video
            src="path/to/second-video.mp4"
            style={{
              opacity: (frame) => interpolate(frame, [0, 30], [0, 1]),
            }}
          />
        </Sequence> */}
      </Series.Sequence>

      {/* <Series.Sequence durationInFrames={170}>
        <Video src="path/to/second-video.mp4" />
      </Series.Sequence> */}
    </Series>
  );
};
